import {View, Text, StyleSheet, TouchableOpacity} from 'react-native'
import React, {Component} from 'react'
import {Actions} from "react-native-router-flux";
import styles from "../../style";
import Icon from 'react-native-vector-icons/Ionicons'
import * as Constant from '../../style/constant'

interface CustomBackButtonProps {
    hideBackButton?: boolean,
    navBarButtonColor?: string,
}

interface CustomBackButtonState {

}


export default class CustomBackButton extends Component<CustomBackButtonProps, CustomBackButtonState> {


    constructor(props: CustomBackButtonProps) {
        super(props);
    }

    render() {
        const actionState: any = Actions.state;
        const routes: any = actionState.routes;
        if (routes[0].index === 0 || this.props.hideBackButton) {
            return <View/>;
        }
        return (
            <TouchableOpacity style={[styles.centered, {paddingHorizontal: 2 * Constant.normalMarginEdge}]}
                              onPress={() => {
                                  Actions.pop();
                              }}>
                <Icon name={'md-arrow-round-back'} size={26} color={this.props.navBarButtonColor || "#555555"}/>
            </TouchableOpacity>
        )
    }
}

const CustomBackButtonStyle = StyleSheet.create({
    container: {}
});

 